/**
 * 登录页面的JavaScript逻辑
 * 
 * 功能说明：
 * 1. 处理用户登录表单的提交
 * 2. 实现表单验证（账号、密码的合法性检查）
 * 3. 处理登录API调用和响应
 * 4. 管理登录状态和Token存储
 */

import userApi from '../../../js/api.js';

document.addEventListener('DOMContentLoaded', function() {
    // 获取表单元素的引用
    const form = document.getElementById('login-form');
    const accountInput = document.getElementById('zhanghao');
    const passwordInput = document.getElementById('mima');

    /**
     * 表单验证函数
     * @returns {boolean} 返回表单是否通过验证
     */
    function validateForm() {
        let isValid = true;

        // 验证账号
        if (!accountInput.value.trim()) {
            showError(accountInput, '请输入账号');
            isValid = false;
        } else {
            clearError(accountInput);
        }

        // 验证密码
        if (!passwordInput.value) {
            showError(passwordInput, '请输入密码');
            isValid = false;
        } else if (passwordInput.value.length < 6) {
            showError(passwordInput, '密码长度不能小于6位');
            isValid = false;
        } else {
            clearError(passwordInput);
        }

        return isValid;
    }

    /**
     * 显示错误信息
     * @param {HTMLElement} input - 输入框元素
     * @param {string} message - 错误信息
     */
    function showError(input, message) {
        const formGroup = input.parentElement;
        formGroup.classList.add('error');
        
        let errorDiv = formGroup.querySelector('.error-message');
        if (!errorDiv) {
            errorDiv = document.createElement('div');
            errorDiv.className = 'error-message text-red-500 text-sm mt-1';
            formGroup.appendChild(errorDiv);
        }
        errorDiv.textContent = message;
    }

    /**
     * 清除表单字段的错误信息
     * @param {HTMLElement} input - 输入框元素
     */
    function clearError(input) {
        const formGroup = input.parentElement;
        formGroup.classList.remove('error');
        const errorDiv = formGroup.querySelector('.error-message');
        if (errorDiv) {
            errorDiv.remove();
        }
    }

    /**
     * 处理表单提交的异步函数
     * 验证表单数据并调用登录API
     * @param {Event} e - 提交事件对象
     */
    form.addEventListener('submit', async function(e) {
        e.preventDefault();

        if (!validateForm()) {
            return;
        }

        try {
            const loginData = {
                email: accountInput.value.trim(),
                password: passwordInput.value
            };

            // 禁用提交按钮，显示加载状态
            const submitButton = form.querySelector('button[type="submit"]');
            submitButton.disabled = true;
            submitButton.textContent = '登录中...';

            const response = await fetch('http://8.218.216.246:3000/api/users/login', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                },
                body: JSON.stringify(loginData)
            });

            const data = await response.json();
            
            if (!response.ok) {
                throw new Error(data.message || '登录失败');
            }
            
            if (data.token) {
                // 登录成功，保存token并跳转
                localStorage.setItem('token', data.token);
                if (data.user) {
                    localStorage.setItem('user', JSON.stringify(data.user));
                }
                window.location.href = '/index.html';
            }
        } catch (error) {
            console.error('Login error:', error);
            showError(accountInput, error.message || '登录失败，请检查账号密码');
        } finally {
            // 恢复提交按钮状态
            submitButton.disabled = false;
            submitButton.textContent = '登录';
        }
    });

    /**
     * 处理忘记密码
     * 
     * @param {Event} e - 点击事件对象
     */
    const forgotPasswordLink = document.querySelector('a[href*="forgot-password"]');
    if (forgotPasswordLink) {
        forgotPasswordLink.addEventListener('click', async function(e) {
            e.preventDefault();
            const email = prompt('请输入您的邮箱地址：');
            
            if (email) {
                if (!isValidEmail(email)) {
                    alert('请输入有效的邮箱地址');
                    return;
                }

                try {
                    const response = await userApi.forgotPassword(email);
                    alert(response.message || '密码重置邮件已发送，请查收');
                } catch (error) {
                    console.error('Forgot password error:', error);
                    alert('发送重置邮件失败，请稍后重试');
                }
            }
        });
    }

    /**
     * 验证邮箱格式
     * @param {string} email - 待验证的邮箱地址
     * @returns {boolean} 返回邮箱格式是否有效
     */
    function isValidEmail(email) {
        const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
        return emailRegex.test(email);
    }

    /**
     * 实时验证表单字段
     * @param {HTMLElement} input - 输入框元素
     */
    function validateField(input) {
        const dummyEvent = { preventDefault: () => {} };
        validateForm(dummyEvent);
    }

    // 添加实时验证监听器
    accountInput.addEventListener('blur', () => validateField(accountInput));
    passwordInput.addEventListener('blur', () => validateField(passwordInput));
});
